<!DOCTYPE html>
<html class="loginHtml" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<title>登录</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="icon" href="/static/favicon.ico">
	<link rel="stylesheet" href="/static/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/static/css/public.css" media="all" />
</head>
<body class="loginBody">
	<form class="layui-form"  method="post">
		<div class="login_text">网吧计费系统</div>
		<div class="layui-form-item input-item">
			<label for="userName">用户名</label>
			<input type="text" placeholder="请输入用户名" autocomplete="off" id="userName" class="layui-input" lay-verify="required">
		</div>
		<div class="layui-form-item input-item">
			<label for="password">密码</label>
			<input type="password" placeholder="请输入密码" autocomplete="off" id="password" class="layui-input" lay-verify="required">
		</div>
		<div class="layui-form-item">
			<button class="layui-btn layui-block" lay-filter="login" lay-submit>登录</button>
		</div>
	</form>
	<script type="text/javascript" src="/static/layui/layui.js"></script>
	<script>
        layui.use(['form','layer','jquery'],function(){
            var form = layui.form,
                layer = parent.layer === undefined ? layui.layer : top.layer
            $ = layui.jquery;

            $(".loginBody .seraph").click(function(){
                layer.msg("这只是做个样式，至于功能，你见过哪个后台能这样登录的？还是老老实实的找管理员去注册吧",{
                    time:5000
                });
            })

			var errorMsg;
            //登录按钮
            form.on("submit(login)",function(data){
                $(this).text("登录中...").attr("disabled","disabled").addClass("layui-disabled");
                setTimeout(function(){
                    $.ajax({
                        type: "POST",
                        url: "/login",
                        data: {"username": $("#userName").val(), "password": $("#password").val()},
                        success:function (res) {
                            if (res.code != 200){
                                // console.log(res)
								//alert(res.msg)
								errorMsg = res.msg;
                                window.location.href = "/"
                            }else {
                                window.location.href = "/index"
                            }
                            // return true;
                            //window.location.href = "/index"
                        }
                    })
                },1000);
                return false;
            })

            //表单输入效果
            $(".loginBody .input-item").click(function(e){
                e.stopPropagation();
                $(this).addClass("layui-input-focus").find(".layui-input").focus();
            })
            $(".loginBody .layui-form-item .layui-input").focus(function(){
                $(this).parent().addClass("layui-input-focus");
            })
            $(".loginBody .layui-form-item .layui-input").blur(function(){
                $(this).parent().removeClass("layui-input-focus");
                if($(this).val() != ''){
                    $(this).parent().addClass("layui-input-active");
                }else{
                    $(this).parent().removeClass("layui-input-active");
                }
            })
        })

	</script>
	<!--<script type="text/javascript" src="/static/js/login.js"></script>-->
	<script type="text/javascript" src="/static/js/cache.js"></script>
</body>
</html>